<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="bootstraptable/bootstrap-table.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">

    <script src="./shandong3d/examples/js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="./bootstraptable/bootstrap-table.js"></script>
    <script src="./bootstraptable/bootstrap-table-zh-CN.js"></script>


</head>
<body>
<div class="detailTable" style="width: 95%;margin: 0 auto">
    <table id="mytab" class="table table-hover"></table>
</div>
</body>
<script src="js/jie/introdnce.js"></script>
<script>
    var introId;

    $('#mytab').bootstrapTable({
        url: 'http://localhost:8089/feiyi/listfeiyi',
        queryParams: "queryParams",
        toolbar: "#toolbar",
        sidePagination: "true",
        striped: true, // 是否显示行间隔色
        //search : "true",
        uniqueId: "ID",
        pageSize: "10",
        pagination: true, // 是否分页
        sortable: true, // 是否启用排序
        paginationShowPageGo: true,//跳转到
        columns: [
            {
                field: 'id',
                title: '序号'
            },
            {
                field: 'type',
                title: '非遗类型'
            },
            {
                field: 'title',
                title: '非遗名称'
            },
            {
                field: 'province',
                title: '非遗地点'
            },
            {
                field: 'detail',
                title: '详情',
                width: 120,
                align: 'center',
                valign: 'middle',
                formatter: actionFormatter,
            },

        ]
    });

    //操作栏的格式化
    function actionFormatter(value, row, index) {
        var id = row.id;
        var result = "";
        result += "<a href=\"javascript:void(0)\" onclick=\"EditId(" + id + ");return false\"><span >详情</span></a>";
        return result;
    }

    // href='./html/jie/introduce.html'

    function EditId(id) {
        $.ajax({
            type: "GET",
            contentType: "application/x-www-form-urlencoded",
            url: "http://localhost:8089/feiyi/getId",
            data: {
                "id": id,
            },
            xhrFields: {withCredentials: true},
            success: function (data) {
                parent.detailData = data.data;
                $(window.parent.document).find('#contentIframe').attr('src', './html/jie/introduce.html');
            },
            //失败的回调函数
            error: function (data) {
                console.log(data.statusText)
            }
        });


    }
</script>
</html>